<comment>
# 组件注释
开通结果组件
</comment>
<template>
  <div class='resultShow'>
    <van-icon
      :name="status ? types[status].iconName : ''"
      :color='status ? types[status].color : ""'
      size='60'/>

    <div style='font-size: 20px;'>{{ status ? types[status].text : '' }}</div>
    <div v-if="status === 'failed'" style='color: #7a7979;'>失败原因:{{ reason }}</div>
  </div>
</template>

<script>
export default {
  name: 'ResultShow',
  components: {},
  data() {
    return {
      types: {
        success: {
          iconName: 'checked',
          text: '开通成功',
          color: 'rgb(17,142,233)'
        },
        failed: {
          iconName: 'clear',
          text: '开通失败',
          color: 'rgb(244,51,59)'
        },
        notExist: {
          iconName: 'warning',
          text: '该用户未开通切片服务',
          color: 'rgb(255,198,1)'
        }
      }
    }
  },
  props: {
    // success failed notExist
    status: {
      type: String
    },
    reason: {
      type: String
    }
  },
  watch: {},
  methods: {},
  computed: {},
  created() {
  },
  mounted() {
  },
  destroyed() {
  }
}
</script>

<style lang='scss' scoped>
.resultShow {
  text-align: center;
  padding: 20px 0;
}
</style>
